<template>
    <div class="app-container">
        <header-title/>
        <el-form
            :model="queryParams"
            ref="queryForm"
            :inline="true"
            v-show="showSearch"
            label-width="110px"
        >
            <el-form-item label="关键词" prop="keyword">
                <el-input
                    v-model="queryParams.keyword"
                    placeholder="证件号/手机号/放款企业名称/商户名称"
                    clearable
                    @keyup.enter.native="handleQuery"
                />
            </el-form-item>
            
            <el-form-item label="任务大类状态" prop="taskBigStatus">
                <el-select v-model="queryParams.taskBigStatus" placeholder="请选择任务大类状态" clearable>
                    <el-option label="待面签" :value="1" ></el-option>
                    <el-option label="已完成" :value="3" ></el-option>
                    <el-option label="已取消" :value="6" ></el-option>

                </el-select>
            </el-form-item>
            
            <el-form-item class="mar-r-20">
                <el-button type="primary" icon="el-icon-search" @click="handleQuery"
                >搜索</el-button
                >
                <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
                <!-- <el-button
                type="danger"
                plain
                icon="el-icon-delete"
                :disabled="multiple"
                @click="handleDelete"
                >删除</el-button> -->
            </el-form-item>
            
        </el-form>
        <el-table
            v-loading="loading"
            :data="tableList"
             
        >   
            <!-- <el-table-column type="selection" width="55" align="center" /> -->
            <el-table-column label="订单编号" min-width="200">
                <template slot-scope="scope">
                    <div
                        class="cur-poin"
                        v-clipboard:copy="scope.row.taskNo"
                        v-clipboard:success="clipboardSuccess"
                    >

                        <span>{{ scope.row.taskNo || "-" }}</span>
                        <i class="color-blue mar-l-5 el-icon-document-copy"></i>
                    </div>
                    <!-- <div class="fw-b"> {{ scope.row.taskNo ||'-' }}</div> -->
                   <!-- <div>第三方任务ID:{{ scope.row.thirdOrderNo ||'-' }}</div> -->
                </template>
            </el-table-column>
           
            <el-table-column label="客户信息" min-width="220">
               <template slot-scope="scope">
                    
                    <div class="fw-b">{{ scope.row.realName || "-" }}/{{ scope.row.phone || "-" }}</div>
                    <div>车牌号：{{ scope.row.carNumber || "-" }}</div>  
                    <div>身份证：{{ scope.row.idCard ||'-' }}</div>                

               </template>
            </el-table-column>
            
           <el-table-column label="合作企业信息" min-width="180">
                <template slot-scope="scope">
                    <div v-if="scope.row.menDian">
                        <div class="fw-b">{{ scope.row.menDian.name || "-" }}</div>
                        <div>联系人：{{ scope.row.menDian.leaderName || "-" }}</div>  
                        <div>联系电话：{{ scope.row.menDian.leaderPhone || "-" }}</div>  
                    </div>
                </template>
            </el-table-column>
            <el-table-column label="放款信息" min-width="160">
                <template slot-scope="scope">
                    <div class="fw-b">放款金额：{{ scope.row.loanMount || "-" }}</div>
                    <div>期数：{{ scope.row.term || "-" }}期</div>  
                    <div>每期金额：{{ scope.row.monthlyPayment || "-" }}元</div>  
                    
                </template>
            </el-table-column>
            <el-table-column label="产品信息" min-width="150">
                <template slot-scope="scope">
                    <div>产品名称：{{ scope.row.cpName ||'-' }}</div>
                    <div>资方名称：{{ scope.row.zfName ||'-' }}</div>
                </template>
            </el-table-column>
            <el-table-column label="订单任务时间" min-width="260">
                <template slot-scope="scope">
                    <div>任务创建时间： {{ scope.row.createTime ||'-' }}</div>
                    <div>开始双录时间： {{ scope.row.cuStartDrTime ||'-' }}</div>
                    <div>任务结束时间： {{ scope.row.endTime ||'-' }}</div>

                </template>
            </el-table-column>
            
            <el-table-column label="任务大类状态" min-width="130">
                <template slot-scope="scope">
                    <el-tag size="small" type="primary" v-if="scope.row.taskBigStatus == 0">初始化</el-tag>
                    <el-tag size="small" type="warning" v-if="scope.row.taskBigStatus == 1">待面签</el-tag>
                    <el-tag size="small" type="success" v-if="scope.row.taskBigStatus == 3">已完成</el-tag>
                    <el-tag size="small" type="danger" v-if="scope.row.taskBigStatus == 6">已取消</el-tag>
                </template>
            </el-table-column>
            <el-table-column label="扣费金额" width="100">
                <template slot-scope="scope">
                    {{ scope.row.consumePoint || '-' }}
                </template>
            </el-table-column>
            <el-table-column label="操作" fixed="right" width="120">
                <template slot-scope="scope">
                    <el-button
                        size="mini"
                        type="text"
                        icon="el-icon-search"
                        @click="onHandleDetail(scope.row)"
                    >详情</el-button>
                    <el-button
                        size="mini"
                        type="text"
                        icon="el-icon-setting"
                        v-if="scope.row.isCanReaset == 1"
                        @click="onHandleReset(scope.row)"
                    >重录</el-button>
                    <!-- <el-button
                        size="mini"
                        type="text"
                        icon="el-icon-delete"
                        @click="handleDelete(scope.row)"
                    >删除</el-button> -->
                </template>
            </el-table-column>
        </el-table>
        <pagination
            :total="total"
            :page.sync="queryParams.pageNum"
            :limit.sync="queryParams.pageSize"
            @pagination="getList"
        >
        </pagination>
        <detail :id="detailId" ref="detail"></detail>
    </div>
</template>
<script>
    import {listTaskPageData,batchDelete,resetDrTask} from '@/api/orderManage/orderList'
    import { mapGetters } from 'vuex'
    import detail from '../components/detail.vue'
    export default{
        dicts: ['ai_type'],
        components: {detail},
        computed: {
          ...mapGetters(['userInfo'])
        },
        data() {
            return {
                queryParams: {
                    pageNum: 1,
                    pageSize: 10,
                    aiPersonCloneTaskId:'',
                    aiType:'',
                    aiVideoMixOutputId:'',
                    isLookFinishedArticleTask:'',
                    keyword:'',
                    partentCozeTaskId:'',
                    taskStatus:'',
                    taskBigStatus:''
                },
                showSearch: true,
                total: 0,
                dateRange: [],
                loading:true,
                // 表格数据
                tableList: [],
                openView: false,
                form: {},
                detailId: '',
                multiple: true,
                ids: [],
                userList:[]
            }
        },
        created() {
            this.queryParams.menDianId = this.userInfo.menDianId
            this.getList()
        },
        methods: {
            onHandleReset(row) {
                
                this.$modal.confirm('是否确认将ID"' + row.aiCozeTaskId + '"任务设置为初始状态？').then(function() {
                    return resetDrTask({taskId: row.aiCozeTaskId});
                }).then(() => {
                    this.getList();
                    this.$modal.msgSuccess("设置成功");
                }).catch(() => {});
            },
            handleDelete(row) {
                const jobIds = row.aiCozeTaskId || this.ids;
                this.$modal.confirm('是否确认删除定时任务编号为"' + jobIds + '"的数据项？').then(function() {
                    return batchDelete(jobIds);
                }).then(() => {
                    this.getList();
                    this.$modal.msgSuccess("删除成功");
                }).catch(() => {});
            },
            /** 任务详细信息 */
            onHandleDetail(row) {
                this.detailId = row.aiCozeTaskId
                this.$nextTick(() => {
                    this.$refs.detail.getDetail()
                })
                // cozeDetail({aiCozeId: row.aiCozeTaskId}).then(response => {
                //     this.form = response.data;
                //     this.openView = true;
                // });
            },
            // 多选框选中数据
            handleSelectionChange(selection) {
                this.ids = selection.map(item => item.aiCozeTaskId);
                // this.single = selection.length != 1;
                this.multiple = !selection.length;
            },
             /** 搜索按钮操作 */
            handleQuery() {
                this.queryParams.pageNum = 1;
                this.getList();
            },
            /** 重置按钮操作 */
            resetQuery() {
                this.resetForm("queryForm");
                this.handleQuery();
            },
            getList() {
                this.loading = true;
                
                listTaskPageData(this.queryParams).then((response) => {
                    this.tableList = response.data.records;
                    this.total = response.data.total;
                    this.loading = false;
                });
            },
             /** 复制代码成功 */
            clipboardSuccess() {
                this.$modal.msgSuccess("订单号复制成功");
            },
        }
    }
</script>